<template>
  <div id="quitWindowContent">
    <el-radio class="select select-child1" v-model="radio" label="1" border
      >直接退出程序</el-radio
    ><br />
    <el-radio class="select select-child2" v-model="radio" label="2" border
      >最小化到系统托盘</el-radio
    ><br />
    <el-checkbox class="select" v-model="checked"
      >记住此次选择，以后不再提示！</el-checkbox
    >
    <br />
    <el-button plain class="select-child4" @click="click('confirm')"
      >确定</el-button
    >
    <el-button plain @click="click('cancle')">取消</el-button>
  </div>
</template>

<script>
const { ipcRenderer } = window.require("electron");
export default {
  data() {
    return {
      radio: "2",
      checked: true,
    };
  },
  methods: {
    click(type) {
      if (type == "confirm") {
        if (this.radio == "1" && this.checked == false) {
          ipcRenderer.send("change_mainWindow", "close_quit");
        } else if (this.radio == "2" && this.checked == false) {
          ipcRenderer.send("change_mainWindow", "close_hide");
          ipcRenderer.send("change_quitWindow");
        } else if (this.radio == "1" && this.checked == true) {
          localStorage.setItem("quitStatus", "quit");
          ipcRenderer.send("change_mainWindow", "close_quit");
        } else if (this.radio == "2" && this.checked == true) {
          localStorage.setItem("quitStatus", "hide");
          ipcRenderer.send("change_mainWindow", "close_hide");
          ipcRenderer.send("change_quitWindow");
        }
      } else if (type == "cancle") {
        ipcRenderer.send("change_quitWindow");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
#quitWindowContent {
  height: 267px;
  width: 398px;
  background-color: #2b2b2b;
  border-left: 1px solid#222225;
  border-right: 1px solid #222225;
  border-bottom: 1px solid #222225;
  .select {
    margin-top: 10px;
    margin-left: 95px;
    width: 200px;
  }
  .select-child1 {
    margin-top: 50px;
  }
  .select-child2 {
    margin-bottom: 5px;
  }
  .select-child4 {
    margin-top: 20px;
    margin-left: 120px;
  }
}

/deep/ .el-radio.is-bordered {
  border: 1px solid #7e7e7e;
}

/deep/.el-radio {
  color: #7e7e7e;
  cursor: pointer;
  margin-right: 30px;
}

/deep/ .el-radio__inner {
  border: 1px solid #7e7e7e;
  background-color: #bacac6;
}

/deep/ .el-radio__inner::after {
  background-color: #bacac6;
}

/deep/.el-radio.is-bordered.is-checked {
  border-color: #9c1a1a;
}

/deep/ .el-radio__input.is-checked + .el-radio__label {
  color: #9c1a1a;
}

/deep/ .el-radio__input.is-checked .el-radio__inner {
  border-color: #9c1a1a;
  background: #9c1a1a;
}

/deep/ .el-checkbox {
  color: #7e7e7e;
}

/deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color: #9c1a1a;
  border-color: #9c1a1a;
}

/deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
  color: #9c1a1a;
}

/deep/ .el-checkbox__inner {
  border: 1px solid #7e7e7e;
  background-color: #bacac6;
}

/deep/ .el-checkbox__input.is-focus .el-checkbox__inner {
  border-color: #9c1a1a;
}

/deep/ button.is-plain:hover {
  background: #9c1a1a;
  border-color: #9c1a1a;
  color: #7e7e7e;
}

/deep/ .el-button {
  background: #2b2b2b;
  border: 1px solid #9c1a1a;
  color: #7e7e7e;
}

/deep/ .el-button.is-plain:focus {
  background: #9c1a1a;
  border-color: #9c1a1a;
  color: #7e7e7e;
}
</style>
